<%@ page pageEncoding="utf-8" %>
<%@include file="/commons/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<fmt:bundle basename="res"><html>
<head>
    <meta charset="utf-8">
    <title><fmt:message key='ggxq'/></title>
    <jsp:include page="/WEB-INF/commons/commons-header.jsp" flush="true"/>
    <style>
        html {
            background: #fff;
        }

        .delete-line {
            cursor: pointer;
        }
    </style>
</head>

<body>

<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
    <div class="layui-tab-content" style="height: 100%;">
        <div class="layui-tab-item layui-show">
            <div class="layui-container">
                <div class="layui-form" lay-filter="layuiadmin-app-form-list" id="layuiadmin-app-form-list" style="padding: 20px 30px 0 0;">
                    <form:form commandName="subject" method="post">

                        <form:hidden path="id"/>

                        <input type="hidden" name="_method" value="${_method}">

                        <div class="layui-form-item">
                            <label class="layui-form-label"><span style="color: red;">*</span><fmt:message key='ptlx'/></label>
                            <div class="layui-input-inline" style="width: 70%;">
                                <input type="radio" lay-verify="required" name="platformType" value="0"
                                       <c:if test="${subject.platformType == 0}">checked</c:if> title="<fmt:message key='yhscd'/>">
                                <input type="radio" lay-verify="required" name="platformType" value="1"
                                       <c:if test="${subject.platformType == 1}">checked</c:if> title="<fmt:message key='sjcgd'/>">
                            </div>
                        </div>


                        <div class="layui-form-item">
                            <label class="layui-form-label"><span style="color: red;">*</span><fmt:message key='ztmc'/></label>
                            <div class="layui-input-inline">
                                <form:input class="layui-input" lay-verify="required" path="name"/>
                            </div>
                        </div>


                        <div class="layui-form-item">
                            <label class="layui-form-label"><span style="color: red;">*</span><fmt:message key='ztsp'/></label>
                            <div class="layui-input-inline" style="width: 600px;">
                                <input type="button" value="<fmt:message key='xzsp'/>" class="layui-btn layui-btn-normal layui-btn-sm select-goods">
                                <table class="layui-table" style="width: 100%;">
                                    <thead>
                                    <tr>
                                        <th><fmt:message key='spmc'/></th>
                                        <th style="width: 120px;"><fmt:message key='pxz'/></th>
                                        <th style="width: 80px;"><fmt:message key='cz'/></th>
                                    </tr>
                                    </thead>
                                    <tbody id="table-body">
                                    <c:forEach varStatus="status" var="item" items="${subject.goodsSubjects}">
                                        <tr id="${item.goods.id}">
                                            <td>${item.goods.name}<input type="hidden" name="goodsSubjects[${status.index}].goods.id" value="${item.goods.id}"></td>
                                            <td><input type="text" class="layui-input" name="goodsSubjects[${status.index}].rank" value="${item.rank}"></td>
                                            <td><a class="delete-line"><fmt:message key='sc'/></a></td>
                                        </tr>
                                    </c:forEach>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label"><span style="color: red;">*</span><fmt:message key='ztpxz'/></label>
                            <div class="layui-inline">
                                <input class="layui-input" lay-verify="required" name="rank" value="${subject.rank > 0 ? subject.rank : 50}"/>
                            </div>
                            <div class="layui-inline"><fmt:message key='pxzyxykq'/></div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label"></label>
                            <div class="layui-input-inline">
                                <input type="button" style="display: none;" value="<fmt:message key='qd1'/>" id="submit" lay-filter="submit" lay-submit class="layui-btn">
                            </div>
                        </div>
                    </form:form>
                </div>
            </div>
        </div>

    </div>
</div>

<script>

    layui.use(['form'], function () {
        var form = layui.form;

        var count = $("#table-body tr").length;

        $(document).on("click", ".delete-line", function () {
            $(this).parent().parent().remove();
        });

        $(".select-goods").click(function () {
            layer.open({
                type: 2,
                content: "${web_domain}/mall/subject/selectGoods?platformType=" + $("input[name='platformType']:checked").val(),
                area: ["90%", "90%"],
                btn: ["<fmt:message key='qd1'/>", "<fmt:message key='qx'/>"],
                yes: function (index, layero) {

                    var goods = layero.find('iframe').contents().find("input.feijin-check:checked");

                    goods.each(function (index, item) {

                        var id = item.getAttribute("data-id");

                        if ($("#" + id).length === 0) {
                            var name = item.getAttribute("data-name");

                            $("#table-body").append('<tr id="' + id +'">\n' +
                                '                                            <td>' + name + '<input type="hidden" name="goodsSubjects[' + count + '].goods.id" value="' + id + '"></td>\n' +
                                '                                            <td><input type="text" class="layui-input" name="goodsSubjects[' + count + '].rank" value="50"></td>\n' +
                                '                                            <td><a class="delete-line"><fmt:message key='sc'/></a></td>\n' +
                                '                                        </tr>');

                            count++;
                        }
                    });

                    layer.close(index);
                }
            })
        });

        form.on('submit(submit)', function () {

            $("#subject").ajaxSubmit({
                success: function (res) {
                    if (res.status) {
                        layer.alert("<fmt:message key='bccg'/>", function () {
                            parent.location.reload();
                        });
                    } else {
                        layer.alert(res.message);
                    }
                }
            });
        });
    });
</script>
</body>
</fmt:bundle>
</html>